<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('录入')"/>
    <link th:href="@{/ajax/libs/bootstrap-tagsinput/tagsinput.css}" rel="stylesheet">
    <link th:href="@{/ajax/libs/jQuery-ui/jquery-ui.css}" rel="stylesheet">
    <link th:href="@{/css/elemen.css}" rel="stylesheet">

</head>
<style>
    .bootstrap-tagsinput > input {
        display: none;
    }
</style>

<body style="background-color: #F4F6FA">
<div class="main-content" id="app" style="margin: 0;padding: 0">

    <form id="form-user-add" class="form-horizontal" style="background-color: #F4F6FA">

        <div class="col-sm-12" style="display: flex">
            <!--     左       -->
            <div class="col-sm-6 entering-page">
                <!--   来电基本信息     -->
                <div class="col-sm-12 tltieBoder">
                    <div class="blueBorder"></div>
                    <h4 style="margin:0 0 0 10px">来电基本信息</h4>
                </div>
                <!--事发地址-->
                <div class="col-sm-12 entering-mt">
                    <div class="form-group">
                        <label class="col-sm-2 control-label is-required entering-pd">事发地址：</label>
                        <div class="col-sm-8">
                            <input name="theAddress" placeholder="请输入" class="form-control scene theAddress" type="text"
                                   maxlength="30"
                                   required="">
                        </div>
                        <div class="col-sm-2">
                            <button type="button" class="btn btn-sm btn-primary"
                                    style="margin-top: 3px;color: #206ef7;background-color: white"
                                    onclick="sensitivity()">敏感信息
                            </button>
                        </div>
                    </div>
                </div>
                <!-- 来电类型,内容类别..-->
                <div class="col-sm-12">
                    <div class="form-group col-sm-6">
                        <label class="col-sm-4 control-label  entering-pd">来电类别：</label>
                        <div class="col-sm-8">
                            <select name="phoneCategory" id="phoneCategory" class="form-control m-b phoneCategory">
                                <option value="">-请选择-</option>
                                <option value="1">投诉</option>
                                <option value="2">建议</option>
                                <option value="3" selected>表扬</option>

                            </select>
                        </div>
                    </div>
                    <div class="form-group col-sm-6">
                        <label class="col-sm-4 control-label  entering-pd">内容类别：</label>
                        <div class="col-sm-8">
                            <select name="remarkCategory" id="remarkCategory" class="form-control m-b">
                                <option selected>-请选择-</option>
                            </select>
                        </div>
                    </div>
                    <div class="form-group col-sm-6">
                        <label class="col-sm-4 control-label entering-pd">流水号：</label>
                        <div class="col-sm-8">
                            <input name="serial" placeholder="请输入" class="form-control serial" type="text"
                                   maxlength="11" required="">
                        </div>
                    </div>
                    <div class="form-group col-sm-6">
                        <label class="col-sm-4 control-label entering-pd">提取码：</label>
                        <div class="col-sm-8">
                            <input name="code" placeholder="请输入" class="form-control code" type="text"
                                   maxlength="11" required="">
                        </div>
                    </div>
                </div>
                <!--来电类容-->
                <div class="col-sm-12">
                    <div class="form-group">
                        <label class="col-xs-2 control-label entering-pd">来电内容：</label>
                        <div class="col-xs-10">
                            <!-- 标签-->
                            <div class="col-sm-12">
                                <div style="float: right;">
                                    <input class="phoneRemarkTog" type="text" value="jQuery,Script,Net"
                                           data-role="tagsinput">
                                </div>

                            </div>
                            <textarea name="phoneRemark" maxlength="1000" class="form-control phoneRemark" rows="3"
                                      style="height: 100px"></textarea>

                            <span>还可以输入<i class="phoneRemarkI">1000</i>个文字</span>

                        </div>
                    </div>
                </div>
                <!--备注坐席-->
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-xs-3 control-label entering-pd">备注坐席：</label>
                        <div class="col-xs-9">
                            <textarea name="SeatsRemark" maxlength="3500" class="form-control SeatsRemark"
                                      rows="3" style="height: 100px"></textarea>
                            <span style="display: inline-block;margin-top: 6px">还可以输入<i class="SeatsRemarkI">1000</i>个文字</span>
                            <!--标签-->
                            <div style="    float: right;display: flex;flex-direction: row;align-items: center;">

                                <input class="SeatsRemarkTog" type="text" value="Script"
                                       data-role="tagsinput">
                            </div>
                        </div>

                    </div>
                </div>
                <!-- 操作记录-->
                <div class="col-sm-6">
                    <label class="col-xs-4 control-label ">操作记录：</label>
                    <div class="demo-list">
                        <div class="roll-list">
                            <div class="item col-xs-12" style="color: #969596">2021-10-22 10:22:43</div>
                            <div class="item-center">
                                <div class="item">张三</div>
                                <div class="item">签收</div>
                            </div>
                        </div>
                        <div class="roll-list">
                            <div class="item col-xs-12" style="color: #969596">2021-10-22 10:22:43</div>
                            <div class="item-center">
                                <div class="item">张三</div>
                                <div class="item">签收</div>
                            </div>
                        </div>
                        <div class="roll-list">
                            <div class="item col-xs-12" style="color: #969596">2021-10-22 10:22:43</div>
                            <div class="item-center">
                                <div class="item">张三</div>
                                <div class="item">签收</div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-12">
                    <div class="col-sm-6">
                        <div class="form-group">
                            <label class="col-xs-4 control-label">屏蔽号码：</label>
                            <div class="col-xs-8">
                                <label class="check-box">
                                    <input name="shieldPhone" type="radio">是
                                </label>
                                <label class="check-box">
                                    <input name="shieldPhone" type="radio" checked>否
                                </label>
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-6">
                        <div class="form-group">
                            <label class="col-xs-4 control-label">同意公开：</label>
                            <div class="col-xs-8">
                                <label class="check-box">
                                    <input name="open" type="radio">是
                                </label>
                                <label class="check-box">
                                    <input name="open" type="radio" checked>否
                                </label>
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-6">
                        <div class="form-group">
                            <label class="col-xs-4 control-label">重复来电：</label>
                            <div class="col-xs-8">
                                <label class="check-box">
                                    <input name="repetitionPhone" type="radio">是
                                </label>
                                <label class="check-box">
                                    <input name="repetitionPhone" type="radio" checked>否
                                </label>
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-6">
                        <div class="form-group">
                            <label class="col-xs-4 control-label">紧急联系：</label>
                            <div class="col-xs-8">
                                <label class="check-box">
                                    <input name="emergencyContact" type="radio">是
                                </label>
                                <label class="check-box">
                                    <input name="emergencyContact" type="radio" checked>否
                                </label>
                            </div>
                        </div>
                    </div>
                </div>


            </div>

            <!--     右       -->
            <div class="col-sm-6 entering-page">
                <div class="col-sm-12">
                    <!--   工单基本信息     -->
                    <div class="col-sm-12 tltieBoder">
                        <div class="blueBorder"></div>
                        <h4 style="margin:0 0 0 10px">工单基本信息</h4>
                    </div>
                    <!--工单主题,工单编号,工单性质...-->
                    <div class="col-sm-12">
                        <div class="form-group col-sm-6">
                            <label class="col-sm-4 control-label entering-pd">工单主题：</label>
                            <div class="col-sm-8">
                                <input name="workTheme" placeholder="请输入" class="form-control workTheme" type="text"
                                       required="">
                            </div>
                        </div>
                        <div class="form-group col-sm-6">
                            <label class="col-sm-4 control-label entering-pd">工单编号：</label>
                            <div class="col-sm-8">
                                <input name="workNumber" placeholder="请输入" class="form-control workNumber" type="text"
                                       required="">
                            </div>
                        </div>
                        <div class="form-group col-sm-6">
                            <label class="col-sm-4 control-label entering-pd">工单性质：</label>
                            <div class="col-sm-8">
                                <input name="workCharacter" placeholder="请输入" class="form-control workCharacter"
                                       type="text"
                                       required="">
                            </div>
                        </div>
                        <div class="form-group col-sm-6">
                            <label class="col-sm-4 control-label entering-pd is-required">拟办期限：</label>
                            <div class="col-sm-8">
                                <input name="deadline" placeholder="请输入" class="form-control deadline" type="text"
                                       required="">
                            </div>
                            <div class="input-group-append " style="position: absolute;top: 10px;right: 40px;">
                                <span class="glyphicon glyphicon-calendar"></span>
                            </div>
                        </div>
                    </div>
                    <!-- 单选-->
                    <div class="col-sm-12">
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label class="col-xs-4 control-label">建议公开：</label>
                                <div class="col-xs-8">
                                    <label class="check-box">
                                        <input name="suggestOpen" type="radio">是
                                    </label>
                                    <label class="check-box">
                                        <input name="suggestOpen" type="radio" checked>否
                                    </label>
                                </div>
                            </div>
                        </div>
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label class="col-xs-4 control-label is-required">是否督办：</label>
                                <div class="col-xs-8">
                                    <label class="check-box">
                                        <input name="supervision" type="radio">是
                                    </label>
                                    <label class="check-box">
                                        <input name="supervision" type="radio" checked>否
                                    </label>
                                </div>
                            </div>
                        </div>
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label class="col-xs-4 control-label">重点项目：</label>
                                <div class="col-xs-8">
                                    <label class="check-box">
                                        <input name="emphasisProject" type="radio">是
                                    </label>
                                    <label class="check-box">
                                        <input name="emphasisProject" type="radio" checked>否
                                    </label>
                                </div>
                            </div>
                        </div>
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label class="col-xs-4 control-label">摘报：</label>
                                <div class="col-xs-8">
                                    <label class="check-box">
                                        <input name="extract" type="radio">是
                                    </label>
                                    <label class="check-box">
                                        <input name="extract" type="radio" checked>否
                                    </label>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- 工单备注-->
                    <div class="col-sm-6" style="margin: 8px 0 8px 0;">
                        <div class="form-group">
                            <label class="col-xs-3 control-label entering-pd">工单备注：</label>

                            <div class="col-xs-12">
                                <!--呈批-->
                                <div class="col-sm-12">
                                    <div style="float: right;"><span class="glyphicon glyphicon-cloud-upload"
                                                                     style="color: #206EF7"></span><a>呈批</a></div>
                                </div>
                                <textarea name="workRemark" maxlength="3500" class="form-control workRemark"
                                          rows="3" style="height: 100px"></textarea>
                                <span>还可以输入<i class="workRemarkI">3500</i>个文字</span>
                            </div>
                        </div>
                    </div>
                    <!--回访意见-->
                    <div class="col-sm-6">
                        <div class="form-group">
                            <label class="col-xs-3 control-label entering-pd">回访意见：</label>
                            <div class="col-xs-12" style="margin-top: 25px">
                                <table id="tab"></table>
                                <!--                                <template>-->
                                <!--                                    <el-table :data="tableData" style="width: 100%" max-height="100">-->
                                <!--                                        <el-table-column prop="date" label="日期" width="100"></el-table-column>-->
                                <!--                                        <el-table-column prop="name" label="姓名" width="100"></el-table-column>-->
                                <!--                                        <el-table-column prop="province" label="省份" width="100"></el-table-column>-->
                                <!--                                        <el-table-column prop="city" label="市区" width="120"></el-table-column>-->
                                <!--                                        <el-table-column prop="address" label="地址" width="300"></el-table-column>-->
                                <!--                                        <el-table-column prop="zip" label="邮编" width="120"></el-table-column>-->
                                <!--                                        <el-table-column fixed="right" label="操作" width="120">-->
                                <!--                                            <template slot-scope="scope">-->
                                <!--                                                <el-button @click.native.prevent="deleteRow(scope.$index, tableData)" type="text" size="small">-->
                                <!--                                                    移除-->
                                <!--                                                </el-button>-->
                                <!--                                            </template>-->
                                <!--                                        </el-table-column>-->
                                <!--                                    </el-table>-->
                                <!--                                </template>-->
                            </div>
                        </div>

                    </div>

                    <!--   工单基本信息     -->
                    <div class="col-sm-12 tltieBoder">
                        <div class="blueBorder"></div>
                        <h4 style="margin:0 0 0 10px">拟办部门</h4>
                    </div>
                    <div class="col-sm-12">
                        <table id="table"></table>
                    </div>
                </div>
            </div>

        </div>
        <!--按钮-->
        <div class="col-sm-12 entering-bt" style="justify-content: center;">

            <button type="button" class="btn btn-sm btn-info" onclick="answer()">通过并派单
            </button>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <button type="button" class="btn btn-sm btn-success" onclick="invalidPhone()">直接答复
            </button>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <button type="button" class="btn btn-sm btn-warning" onclick="gclose()">关闭
            </button>&nbsp;

        </div>
    </form>


</div>

<script th:src="@{/ajax/libs/layui/laydate.js}"></script>
<th:block th:include="include :: footer"/>
<script th:src="@{/ajax/libs/bootstrap-tagsinput/tagsinput.min.js}"></script>
<script th:src="@{/ajax/libs/jQuery-ui/jquery-ui.js}"></script>
<script th:src="@{/js/vue.js}"></script>
<script th:src="@{/js/elemen.js}"></script>
<script th:src="@{/js/teladd.js}"></script>
<script th:src="@{/js/tworkformadd.js}"></script>

<script>

</script>
</body>
</html>

